<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=
    , initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        var students = [{
            sid: 1,
            name: '张三',
            classid: 1
        }, {
            sid: 2,
            name: '李四',
            classid: 2
        }, {
            sid: 3,
            name: '王五',
            classid: 3
        }, {
            sid: 4,
            name: '小明',
            classid: 4
        }, {
            sid: 5,
            name: '小毛',
            classid: 6
        }, {
            sid: 7,
            name: '小胡',
            classid: 7
        }, {
            sid: 13,
            name: '小周',
            classid: 1
        }, {
            sid: 24,
            name: '小张',
            classid: 3
        }, ]

        var classes = [{
            cid: 1,
            cname: '一班'
        }, {
            cid: 2,
            cname: '二班'
        }, {
            cid: 3,
            cname: '三班'
        }, {
            cid: 4,
            cname: '四班'
        }, {
            cid: 5,
            cname: '五班'
        }, {
            cid: 6,
            cname: '六班'
        }, {
            cid: 7,
            cname: '七班'
        }, {
            cid: 8,
            cname: '八班'
        }, ]

        // 方式一：
        // 将学生放进数组，然后赋值给班级
        // 尽量不去改变原数组  这里我们重新开一个新数组！
        let newArr = []
        classes.forEach(classItem => {
            let stu = []
            students.forEach(student => {
                if (student.classid == classItem.cid) {
                    stu.push(student)
                }
            });
            // 剔除没有学生的班级
            if (stu.length) {
                newArr.push({
                    ...classItem,
                    stu
                })
            }

        });
        //console.log(JSON.stringify(newArr, null, ' ')) //JSON输出格式  get！  最后一个参数代表格式化

        // 方式二：
        // 将学生放到对应班级
        newArr = []
        let classObj = {} //创建班级新对象 { 1(班级id) : [{学生对象},{学生对象}]}
        students.forEach(student => {
            // 如果当前班级id在对象中不存在，就给个[],有就用原来的
            classObj[student.classid] = classObj[student.classid] || []

            classObj[student.classid].push(student)
        })
        classes.forEach(classItem => { //拿着classObj的键  匹配班级ID然后赋值
            if (classObj[classItem.cid]) {
                newArr.push({
                    ...classItem,
                    stu: classObj[classItem.cid]
                })
            }
        })
        console.log(JSON.stringify(newArr, null, '  '))

        // 结果：
        /* [
            {
                cid: 1, cname: '一班', stu: [
                    {
                        sid: 1,
                        name: '张三',
                        classid: 1
                    },
                    {
                        sid: 13,
                        name: '小周',
                        classid: 1
                    }]
            },
            {
                cid: 1, cname: '二班', stu: [
                    {
                        sid: 2,
                        name: '李四',
                        classid: 2
                    }]
            },
        ] */
    </script>
</body>

</html>